<template>
  <el-dialog title="关联作业类型"
             :visible.sync="dialogForm"
             width="1100px">
    <base-list ref="workType"
               :condition="condition"
               :datas.sync="workType"
               :pageSearch="pageSearch">
      <el-form :inline="true"
               :model="condition"
               class="search-form"
               slot="search"
               label-width="100px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="作业类型">
              <auto-search-dic @selectName="v=>condition['search_LIKE_dicName']=v"
                               :name="condition['search_LIKE_dicName']"
                               code="JOB_ZYLX"></auto-search-dic>
            </el-form-item>
          </el-col>
          <el-col :span="2">
            <el-button type="primary"
                       icon="el-icon-search"
                       @click="loadData"
                       class="ml-100">查 询</el-button>
          </el-col>
        </el-row>
      </el-form>
      <el-table slot="list"
                ref="multipleTable"
                :data="workType"
                border
                stripe
                max-height="500"
                @selection-change="handleSelectionChange">
        <el-table-column type="selection"
                         width="55">
        </el-table-column>
        <el-table-column type="index"
                         fixed="left"
                         label="序号"
                         width="55">
          <template slot-scope="scope">
            {{ scope.$index+1 }}
          </template>
        </el-table-column>
        <el-table-column prop="dicName"
                         label="作业类型"
                         
                         min-width="130"></el-table-column>
      </el-table>
    </base-list>

    <div slot="footer"
         class="dialog-footer">
      <el-button @click="dialogForm = false">取 消</el-button>
      <el-button type="primary"
                 @click="handleSubmit"
                 :loading="$store.getters.loadingBtn">保 存</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { getSystemDictionaryList } from '@/api/system/systemDictionary'
import { contactList } from '@/api/warehouseOperationPoint/warehouseOperationPoint'
import autoSearchDic from '@/components/autocomplete/autoSearchDic'

export default {
  name: 'workType',
  components: {
    autoSearchDic
  },
  data() {
    return {
      form: this.clearForm(),
      condition: {}, // 查询条件
      workType: [], // table数组
      pageSearch: getSystemDictionaryList, // 分页查询api接口
      dialogForm: false,
      multipleSelection: []
    }
  },
  mounted() {
    getSystemDictionaryList().then(res => {
      let data = res.data.aaData
      for(let item of data){
        if(item.dicCode === 'JOB_ZYLX'){
           this.workType = item.dicArr
        } 
      }
    })
  },
  methods: {
    clearForm() {
      return {
        orgId: '',
        orgId:
          this.$store.state.user.currentUser.org &&
          this.$store.state.user.currentUser.org.id,
        orgName:
          this.$store.state.user.currentUser.org &&
          this.$store.state.user.currentUser.org.name
      }
    },
    loadData() {
      this.$refs.workType.loadData()
    },
    // 保存
    handleSubmit() {
      contactList(this.form.id, { jobTypes: this.multipleSelection }).then(
        res => {
          this.$message({ message: '作业类型关联成功!', type: 'success' })
          this.dialogForm = false
          this.$emit('wload')
        }
      )
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    rectWorkType(val) {
      this.form.id = val.id
      this.$nextTick(function() {
        if (val.jobTypes) {
          if(this.$refs.multipleTable) {
            this.$refs.multipleTable.clearSelection();
          }
          this.workType.forEach(row => {
            for (let item of val.jobTypes) {
              if (item.dicCode === row.dicCode) {
                this.$nextTick(function() {
                  this.$refs.multipleTable.toggleRowSelection(row, true)
                })
              }
            }
          })
        } else {
          this.$refs.multipleTable.clearSelection()
        }
      })
    }
  }
}
</script>

<style scoped>
</style>
